<template>
  <div class="flex_box_header">
    <div v-for="(item,index) in data_list" :key="index" class="box_item" :style="{flex:item.flex}">
      {{ item.name }}
    </div>
  </div>
</template>

<script>
export default {
  name: "table_header_auto",
  props: {
    data_list: []
  }
}
</script>

<style scoped lang="scss">
.flex_box_header {
  display: flex;
  flex-direction: row;
  font-size: 0.9rem;
  color: #4d5aec;

  .box_item {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2rem;
    flex: 1;
  }
}
</style>
